<template>
	<view class="task-wrap" @click="dialogBtns_hidden = false">
		<view class="scroll-wrap"  style="position: relative;">
			<view class="tabContainer" style="margin-bottom: 120px;">
				<!-- 样品列表 -->
				<template v-for="(item, index) in sampleTaskInfo.sampleItemVos">
					<sampleTerm :status="true" :checkboxVisible="checkboxVisible" :isEgManage='isEgManage' :sampleData="item" title="详情" :editable="false" detailStatus="0" ids="ids"></sampleTerm>
				</template>
			</view>
			<view class="footerBtn" style="display: flex;align-items: center;" >
				<view class="btn footerBtn footerBtns">
					<view class="" style="position: relative;flex: 1;">
						<view class="dialogBtns" v-show="dialogBtns_hidden">
							<button type="warning" class="dialogBtn"  @click="modify">批量修改样品</button>
							<button type="warning" class="dialogBtn" @click="del">批量删除样品</button>
						</view>
						<view style="padding:0 10px;"  >
							<button class="leftTabsBtn" @click.stop="openDialogBtns" type="warning">批量操作</button>
						</view>
					</view>
					
					<view style="padding:0 10px;flex: 1;">
						<button class="rightTabsBtn" type="primary" @click="toEgManage">新增样品</button>
					</view>
				</view>
				
			</view>
		</view>
    </view>
</template>

<script>
	import sampleTerm from '@/components/sample/sample-term.vue'
	export default {
		components:{
			sampleTerm,
		},
		data() {
			return {
				dialogBtns_hidden:false,
				isEgManage:false,
				modifyVisible:false,
				delVisible:false,
				checkboxVisible:false,
				singleModifyBtn:false,
				singleDelBtn:false,
				
				taskId: '',
				sampleTaskInfo: {
					projectName: '',
					consignorName: '',
					inspectionName: '',
					sampleCount: '',
					jobId: '',
					inspectionLinker: '',
					singImageUrl: '',
					sampleVos:[],
				},
				ids:""
			}
		},
		onLoad (e) {
			if(e.taskId) {
				this.taskId = e.taskId
			}
			this.ids = e.ids
		},
		onShow() {
			this.getSampleVos()
		},
		methods: {
			getSampleVos() {
				this.$api.getSamplerList('sample/items/' + this.taskId,res => {
				    if (res.code === 200) {
				        this.sampleTaskInfo = res.result	|| []			
				    }
				})
			},
			//打开批量操作弹出按钮框
			openDialogBtns() {
				let _this = this
				_this.dialogBtns_hidden = true
				console.log(_this.dialogBtns_hidden,6666);
				this.$forceUpdate()
			},
			//批量修改
			modify(){
				this.dialogBtns_hidden = false
				this.$common.navigateTo('/pages/sampleLeader/opt/batchModify?taskId=' + this.taskId);
			},
			//批量删除
			del(){
				this.dialogBtns_hidden = false
				this.$common.navigateTo('/pages/sampleLeader/opt/batchDel?taskId=' + this.taskId);
			},
			goToHandWriting(sampItemId){
				this.$common.navigateTo('/pages/handWriting/index?sampItemId='+sampItemId);
			},
			toEgManage(){
				this.$common.navigateTo('/pages/sampleLeader/opt/addEg?taskId=' + this.taskId);
			}
		}
	}
</script>

<style scoped>
		uni-page-body{
			height: 100%;
		}
	.task-wrap{
		background: #F0F2FA;
		height: 100vh;
		display: flex;
		flex-direction: column;
		
	}
	.project-info{
		height: 280rpx;
		width:calc(100%-98rpx);
		background-color: #D6D8DF;
		padding-left: 49rpx;
		padding-right: 49rpx;
	}
	.sample-detail{
		margin-top: 20rpx;
		font-size: 25rpx;
		height: 32rpx;
		display: flex;
		align-items: center;
		
	}
	.sample-detail .title{
		color:#193566;
		font-weight: bolder;
		opacity: 0.8;
		display: inline-block;
		width: 140rpx;
		text-align: right;
	}
	.sample-detail .value{
		color:#193566;
		font-weight: 400;
		opacity: 0.7;
		width: 65%;
		display: inline-block;
		padding-left:5%;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		display: inline-block;
	}
	.scroll-wrap{
		flex: 1;
		overflow: scroll;
		padding-bottom: 50rpx;
	}
	.tabContainer{
		height: auto;
	}
	.signature{
		position: absolute;
		top: 0;
		right: 0;
		width: 167rpx;
		height: 61rpx;
		color: #fff;
		background-color: #193566;
		border-radius: 19rpx 19rpx 19rpx 19rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 25rpx;
	}
	.signatureImg image{
		position: absolute;
		top: 0;
		right: 0;
		width: 61rpx;
		height: 61rpx; 
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 25rpx;
	}
	.footerBtn {
		position: fixed;
		bottom: 0;
		 left: 0;
		 width: 100%;
	}
	.btn {
		border-radius: 0;
		width: 100%;
		background: #2f3a89;
	}
	.footerBtns {
		display: flex;
		background: #d2dcf8;
		padding: 10rpx 0;
		box-shadow: -1px 0 1px #ccc;
	}
	.dialogBtns {
		position: absolute;
		top: -180rpx;
		left: 0;
		padding:10rpx 20rpx;
		background: #d2dcf8;
		width: 100%;
		box-shadow: 1px 0px 1px #ccc;
		padding-top: 20rpx;
	}
	.dialogBtn {
		border: 1px solid #eee;
		margin-bottom: 10rpx;
		width: 100%;
		padding: 0;
		font-size: 14px;
		height: 60rpx;
		line-height: 60rpx;
		color:#2f3a89;
		background: #ffda94;
	}
	.leftTabsBtn {
		width: 100%;
		border: 1px solid #eee;
		font-size: 14px;
		color:#2f3a89;
		background: #ffda94;
	}
	.rightTabsBtn {
		font-size: 14px;
		background: #2f3a89;
	}
	.rightTabsSingleBtn {
		width: 50%;
		color: #2f3a89;
		height: 60rpx;
		font-size: 14px;
		box-shadow: 1px 1px 3px #ccc;
		
	}
</style>
